<template>
  <div class="deal_page">
    <el-scrollbar class="el_scroll">
      <el-table class="el_table" :data="dealInfoList" size="mini">
        <el-table-column type="expand">
          <template slot-scope="{row}">
            <el-table class="el_inner_table" :data="row.dealList" size="mini">
              <el-table-column label="收款类型" prop="dealType"></el-table-column>
              <el-table-column label="成交金额" prop="dealAmount"></el-table-column>
              <el-table-column label="收款金额" prop="collectMoney"></el-table-column>
              <el-table-column label="收款时间" prop="collectTime"></el-table-column>
              <el-table-column label="门诊反馈" prop="outpatientFeedback" width="400">
                <template slot-scope="{row}">
                  <el-tooltip class="item" effect="dark" placement="top-start">
                    <div slot="content" style="max-width:240px">{{row.outpatientFeedback}}</div>
                    <div class="tab_txt">{{row.outpatientFeedback}}</div>
                  </el-tooltip>
                </template>
              </el-table-column>
              <el-table-column label="备注" prop="remark" width="400">
                <template slot-scope="{row}">
                  <el-tooltip class="item" effect="dark" placement="top-start">
                    <div slot="content" style="max-width:240px">{{row.remark}}</div>
                    <div class="tab_txt">{{row.remark}}</div>
                  </el-tooltip>
                </template>
              </el-table-column>
            </el-table>
          </template>
        </el-table-column>
        <el-table-column label="预约医院" prop="hospitalName"></el-table-column>
        <el-table-column label="预约时间" prop="appointmentTime"></el-table-column>
        <el-table-column label="成交项目" prop="dealProjectNames"></el-table-column>
        <el-table-column label="报名费处理" prop="enrollFeeHandle"></el-table-column>
        <el-table-column label="收款情况" prop="dealType"></el-table-column>
        <el-table-column label="总成交金额" prop="totalDealAmount"></el-table-column>
        <el-table-column label="总收款金额" prop="totalCollectMoney"></el-table-column>
        <el-table-column label="首次收款时间" prop="firstCollectTime"></el-table-column>
      </el-table>
    </el-scrollbar>
  </div>
</template>
<script>
export default {
  name: "DealInfo",
  props: {
    userInfo: {
      type: Object,
      default: function () {
        return {};
      },
    },
  },
  watch: {
    userInfo: {
      handler: function (e) {
        console.log(e);
        if (e.dealInfoList) {
          this.dealInfoList = e.dealInfoList;
        }
      },
      immediate: true,
    },
  },
  data() {
    return {
      dealInfoList: [],
    };
  },
  mounted() {},
  methods: {},
};
</script>
<style lang="scss">
.el_scroll {
  .el-scrollbar__wrap {
    max-height: 60vh;
    overflow-x: hidden;
  }
}
</style>
<style lang="scss" scoped>
.deal_page {
  min-height: 360px;
}
.tab_txt {
  display: -webkit-box;
  /**对象作为伸缩盒子模型展示**/
  -webkit-box-orient: vertical;
  /**设置或检索伸缩盒子对象的子元素的排列方式**/
  -webkit-line-clamp: 3;
  /**显示的行数**/
  overflow: hidden;
  /**隐藏超出的内容**/
}
</style>